import { Row, Col, Switch, Tag, DatePicker, Tabs, Icon, Form,  TimePicker, Button, Tooltip, Spin, Popover, Modal } from 'antd';
import { WeaQrcode, WeaDialog, WeaBrowser, WeaNewScroll, WeaFormItem, WeaTab, WeaSearchGroup, WeaTools, WeaHelpfulTip, WeaMap , WeaInput, WeaInputNumber, WeaTextarea, WeaSelect,  WeaCheckbox, WeaDatePicker, 
  WeaTimePicker, WeaDateGroup, WeaSelectGroup, WeaScope , WeaTableEdit,WeaShare } from 'ecCom';
import isEmpty from 'lodash/isEmpty';
import {WeaTableNew, WeaSwitch} from 'comsMobx';
const getKey = WeaTools.getKey;

import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx';

import {WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;


@inject('meetingDialog')
@observer
class SignSiteInfo extends React.Component {
  constructor(props){
    super(props)
    this.state={
      mapVisible:false,
      position: [116.37, 39.92],
      zoom: 14,
    }
  }
  
  getSearchs = () => {
   const { signInfoStatus } = this.props.meetingDialog
   const { signInfo } = signInfoStatus
   let group = []
   let keys = ['userid','signTime','site','signBackTime','backSite']
   let browserParams = {hasAddBtn:false,
   hasAdvanceSerach:true,
   isAutoComplete:1,
   isDetail:0,
   isMultCheckbox:false,
   isSingle:false,
   linkUrl:"/hrm/resource/HrmResource.jsp?id=",
   quickSearchName:"",
   title:`${getLabel(83496,'多人力资源')}`,
   type:"17",
   viewAttr:1
    }
   keys.forEach((item,index)=>{
     if(signInfo&&signInfo[item]){
       let formitem=
        <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@ipuqw6@singInfo${index}`}
          label={(index==0?getLabel(125530,"签到人"):index==1?getLabel(20035,"签到时间"):
          index==2?getLabel(125531,"签到地址"):index==3?getLabel(20039,"签退时间"):index==4?getLabel(132060,"签退地址"):"")}
          labelCol={{span: 5}}
          wrapperCol={{span: 16}}
        >
          {
            index==0?<WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@vert0x@signPerson_${index}`} {...browserParams} replaceDatas={[{id: signInfo['userid'], name: signInfo['username']}]}/>:
            index==1?<div dangerouslySetInnerHTML={{__html: signInfo[item]}}></div>:
            index==2?<a style={{color:"#ababab"}} onClick={()=>{this.openSignMap(signInfo['longitude'],signInfo['latitude'])}}><i className="icon-coms-position" />{signInfo[item]}</a>:
            index==3?<div dangerouslySetInnerHTML={{__html: signInfo[item]}}></div>:
            index==4?<a style={{color:"#ababab"}}  onClick={()=>{this.openSignBackMap(signInfo['signbacklongitude'],signInfo['signbacklatitude'])}}><i className="icon-coms-position" />{signInfo[item]}</a>:""
          }
        </WeaFormItem>
        group.push(formitem)
     }
   })

   return group
  }
  openSignMap=(longitude,latitude)=>{
    const { setSignInfoStatus }=this.props.meetingDialog
   
    setSignInfoStatus({
      position:[Number(latitude),Number(longitude)],
      mapVisible:true
    })
  }
  openSignBackMap=(longitude,latitude)=>{
    const { setSignInfoStatus }=this.props.meetingDialog
    setSignInfoStatus({
      position:[Number(latitude),Number(longitude)],
      mapVisible:true
    })
  }
     
  render(){
    const {  zoom, title, items,  } = this.state;
    const { setSignInfoStatus, signInfoStatus} = this.props.meetingDialog
    const { mapVisible, position } = toJS(signInfoStatus)
    const { visible, } = this.props
    return(
    <div>
        <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@o2gmpx`}
        visible={visible}
        title={getLabel(523589,'签到/签退情况详情') }
        icon={"icon-portal-meeting"}
        iconBgcolor='#f14a2d'
        style={{ width:345, height:300, zIndex: 1051 }}
        parentClassName={'meeting-preview-signInfo-container'}
        className={'meeting-preview-signInfo-container-dialog-content'}
        onCancel={()=>{
          setSignInfoStatus({signInfoVisible:false})
        }}
        >
          <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@krb6cg`} height={"100%"}>
            <div className="preview-signInfo" style={{position: "relative",transform: "translate(20px, 15px)"}}>
              {this.getSearchs()}
            </div>
          </WeaNewScroll>
        </WeaDialog>
      {mapVisible&&position.length&&<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@upaf0d`}
        visible={mapVisible}
        title={getLabel(386506,'位置详情') }
        parentClassName={'meeting-preview-signInfo-location-detail'}
        className={'meeting-preview-signInfo-location-detail-content'}
        icon={"icon-portal-meeting"}
        iconBgcolor='#f14a2d'
        scalable={true}
        style={	{width: 700, height: 550}}
        onCancel={()=>{
          setSignInfoStatus({
            mapVisible:false,
            position:[]
          })
        }}
        >
          <WeaMap ecId={`${this && this.props && this.props.ecId || ''}_WeaMap@u0r83e`} position={position} zoom={24}   plugins={["ToolBar", "Scale"]} />
        </WeaDialog>}
    </div>
    )
  }

}

export default SignSiteInfo